<template>
  <div>
    <list-and-form-list
      v-show="showControl.showList"
      :exec-query="execQuery"
      @showForm="showForm"
    />
    <list-and-form-form v-if="showControl.showForm"
                        :operation-type="formInfo.operation"
                        :business-id="businessInfo.id"
                        :business-data="businessInfo.data"
                        :form-title="formInfo.title"
                        @close="closeForm"
    />
  </div>
</template>

<script>
import ListAndFormForm from '@/views/demo/views/ListAndFormDemo/Form.vue'
import ListAndFormList from '@/views/demo/views/ListAndFormDemo/List.vue'
export default {
  name: 'EbdmnDemoListAndFormindex',
  components: {
    ListAndFormForm,
    ListAndFormList
  },
  data() {
    return {
      // 列表查询控制器，是否执行查询
      execQuery: false,
      // 表单控制内容
      formInfo: {
        display: false,
        title: '',
        operation: 'add'
      },
      // 业务数据内容
      businessInfo: {
        id: '',
        data: {}
      },
      // 显示控制内容
      showControl: {
        showList: false,
        showForm: false
      }
    }
  },
  created() {
    this.showControl.showList = true
  },
  methods: {
    // 打开form表单，根据操作类型，增加或修改
    showForm(operationType, row) {
      console.info(operationType)
      if (row) {
        console.info(row)
      }
      this.showControl.showForm = true
      this.showControl.showList = false
    },
    // 关闭操作（保存成功）
    closeForm(operationType) {
      console.info(operationType)
      this.showControl.showForm = false
      this.showControl.showList = true
    }
  }
}
</script>

<style scoped>

</style>